<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>七七事变</title>
    <meta
      name="viewport"
      content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"
    />
    <script type="text/javascript">
      document.documentElement.style.fontSize =
        (document.documentElement.clientWidth / 750) * 100 + "px";
    </script>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" type="text/css" href="css/p1.css" />
    <link rel="stylesheet" type="text/css" href="css/p2.css" />
    <link rel="stylesheet" type="text/css" href="css/p3.css" />
    <link rel="stylesheet" type="text/css" href="css/p4.css" />
    <link rel="stylesheet" type="text/css" href="css/p5.css" />
    <link rel="stylesheet" type="text/css" href="css/p6.css" />
    <link rel="stylesheet" type="text/css" href="css/p7.css" />
    <link rel="stylesheet" type="text/css" href="css/p8.css" />
    <link rel="stylesheet" type="text/css" href="css/p9.css" />
    <link rel="stylesheet" type="text/css" href="css/p10.css" />
    <link rel="stylesheet" type="text/css" href="css/p11.css" />
    <link rel="stylesheet" type="text/css" href="css/p12.css" />
    <link rel="stylesheet" type="text/css" href="css/p13.css" />
    <link rel="stylesheet" type="text/css" href="css/p14.css" />
    <link rel="stylesheet" type="text/css" href="css/p15.css" />
    <link rel="stylesheet" type="text/css" href="css/effect.css" />
  </head>

  <body>
    <!--第一页面-->
    <div class="page-one page">
      <div class="all1">
        <div id="con">
          <p id="time"><span>1985</span>.7.7</p>
          <div id="gd">
            <p id="gdt"></p>
          </div>
        </div>
      </div>
    </div>
    <!--第二页面-->
    <div class="page-two page" style="display: none;">
      <div class="all2">
        <div id="picture" class="bg">
          <img src="img/3.png" />
          <img src="img/1.png" />
          <img src="img/2.png" />
        </div>
        <div id="con">
          <img src="img/4.png" id="con1" />
          <img src="img/5.png" id="con2" />
          <div id="fot">
            <span>滑动</span>
            <img src="img/三角.png" id="bg" />
          </div>
          <img src="img/下载.png" id="bot2" />
        </div>
      </div>
    </div>
    <!--第三页面-->
    <div class="page-three page" style="display: none;">
      <div class="all3">
        <img src="img/595b269992b5790cc31763a1.jpg" class="bg" />
        <div id="con3">
          <p>[震惊]</p>
          <p>
            1937.7.7<br />
            驻华日军发动“七七事变”，<br />
            开始全面侵华战争。<br />
            中国军队在卢沟桥顽强抗击日军，<br />
            誓与桥，城共存亡！
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第四页面-->
    <div class="page-four page" style="display: none;">
      <div class="all4">
        <img src="img/6.jpg" class="bg" />
        <div id="con4">
          <p>[坚守]</p>
          <p>
            1937.8.13-11.12<br />
            淞沪会战粉碎了日军速战速决的迷梦。<br />
            图为中国军队88师在上海闸北的<br />
            环形工事里同日军巷战。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第五页面-->
    <div class="page-five page" style="display: none;">
      <div class="all5">
        <img src="img/7.jpg" class="bg" />
        <div id="con5">
          <p>[初捷]</p>
          <p>
            1937.9.25<br />
            八路军115师在平型关<br />
            毙敌1000余人，<br />
            粉碎了日军不可战胜的神话<br />
            中共取得了首战大捷。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第六页面-->
    <div class="page-six page" style="display: none;">
      <div class="all6">
        <img src="img/66.jpg" class="bg" />
        <div id="con6">
          <p>[国难]</p>
          <p>
            1937.12.13<br />
            南京沦陷。<br />
            侵华日军对南京及附近地区<br />
            展开了长达6周的大屠杀。<br />
            超过30万同胞遇难。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第七页面-->
    <div class="page-seven page" style="display: none;">
      <div class="all7">
        <img src="img/595b49db92b5790bdc202f56.jpg" class="bg" />
        <div id="bg7"></div>
        <div id="con7">
          <p>[齐心]</p>
          <p>
            1938.7.7<br />
            “七七”事变一周年，<br />
            武汉各阶级民众齐心抗日，<br />
            开展献金运动。<br />
            卖白兰花的儿童把售花所得<br />
            献给抗日运动。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第八页面-->
    <div class="page-eight page" style="display: none;">
      <div class="all8">
        <img src="img/595b591b92b5790c7632bf3c.jpg" class="bg" />
        <div id="bg8"></div>
        <div id="con8">
          <p>[救亡]</p>
          <p>
            1937-1945<br />
            中国共产党领导下的抗日根据地，<br />
            开辟了中国抗战的敌后战场。<br />
            广大民兵一起点燃了游击战的烽火，<br />
            牵制着大量日本侵华兵力。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第九页面-->
    <div class="page-nine page" style="display: none;">
      <div class="all9">
        <img src="img/595b5ac192b5790cfe5fed5e.jpg" class="bg" />
        <div id="bg9"></div>
        <div id="con9">
          <p>[图存]</p>
          <p>
            1940年代<br />
            在抗战最为艰难的战略相持阶段，<br />
            毛泽东同志号召“自己动手，丰衣足食”后，<br />
            陕甘宁边区开展了一场轰轰烈烈的<br />
            军民大生产运动。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十页面-->
    <div class="page-ten page" style="display: none;">
      <div class="all10">
        <img src="img/595b619392b579678a0bbc04.jpg" class="bg" />
        <div id="bg10"></div>
        <div id="con10">
          <p>[不挠]</p>
          <p>
            1940。8-1941.1<br />
            百团大战的胜利遏制了投降的逆流，<br />
            沉重打击了日寇的嚣张气焰，<br />
            鼓舞了中国人民的抗战斗志，<br />
            在我国抗日战争史上写下了光辉的一页。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十一页面-->
    <div class="page-eleven page" style="display: none;">
      <div class="all11">
        <img src="img/595b66ed92b5790c9546d19f.jpg" class="bg" />
        <div id="bg11"></div>
        <div id="con11">
          <p>[不屈]</p>
          <p>
            1941.9.25<br />
            5位八路军在狼牙山阻击日军，<br />
            弹尽粮绝之后，宁死不屈，<br />
            义无反顾地跳下悬崖。
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十二页面-->
    <div class="page-twelve page" style="display: none;">
      <div class="all12">
        <img src="img/595cd07f1e208505c045cc02.jpg" class="bg" />
        <div id="bg12"></div>
        <div id="con12">
          <p>[曙光]</p>
          <p>
            1943.7-1945.9<br />
            世界反法西斯战争发生根本转折，<br />
            日军逐渐失去战略主动权。<br />
            中国军民对侵略者开始战略反攻。<br />
            胜利就在前方！
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十三页面-->
    <div class="page-thirteen page" style="display: none;">
      <div class="all13">
        <img src="img/595da8ed347a19201751a726.jpg" class="bg" />
        <div id="bg13"></div>
        <div id="con13">
          <p>[胜利]</p>
          <p>
            1945.9.9<br />
            中国政府接受侵华日军递交的投降书，<br />
            128万余侵华日军放下武器。<br />
            中国人民终于迎来了胜利的时刻！
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十四页面-->
    <div class="page-fourteen page" style="display: none;">
      <div class="all14">
        <img src="img/595cd22d1e208506182acf61.jpg" class="bg" />
        <div id="bg14"></div>
        <div id="con14">
          <p>[铭记]</p>
          <p>
            1913-1945<br />
            历时14年的中国人民抗日战争，<br />
            尤其是“七七事变”爆发后的全民抗战，<br />
            是近代以来中国抗击外敌入侵的<br />
            第一次完全胜利<br />
            望我辈安不忘危，存不忘亡，<br />
            勿忘国耻，珍视和平！
          </p>
        </div>
        <img src="img/下载.png" id="bot" />
      </div>
    </div>
    <!--第十五页面-->
    <div class="page-fifteen page" style="display: none;">
      <div class="all15">
        <img src="img/595da271347a191fad21c56d.jpg" class="bg" />
        <img src="img/595edfffd091ec05b5560eb6.png" />
        <img src="img/595da2d0347a191f947fee80.png" />
      </div>
    </div>
  </body>
  <script type="text/javascript" src="js/touch.js"></script>
  <script type="text/javascript" src="js/index.js"></script>
</html>
